<template>
  <flexbox align="center" justify="center">
    <div class="empty">
      <p class="empty-title">{{ title }}</p>
      <el-button v-if="btnName"
        class="xr-btn--orange empty-btn"
        icon="el-icon-plus"
        type="primary"
        @click="click">{{ btnName }}</el-button>
    </div>
  </flexbox>
</template>

<script setup>
// 重要信息为空
defineOptions({
  name: 'ImportInfoEmpty',
})

const props = defineProps({
  title: {
    type: String,
    default: '暂无数据'
  },

  btnName: String
})
const emits = defineEmits(['add'])

function click() {
  emits('add')
}

</script>


<style lang="scss" scoped>
.empty {
  text-align: center;

  &-title {
    color: #666;
    font-size: 15px;
  }

  &-btn {
    margin-top: 8px;
  }
}
</style>
